import 'dart:async';
import 'dart:ui';

import 'package:bot_toast/bot_toast.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:dolqun_movies/Configs.dart';
import 'package:dolqun_movies/Entities/UserInformationResult.dart';
import 'package:dolqun_movies/StateManagement/ModelProvider.dart';
import 'package:dolqun_movies/UI/Pages/BlurredProfilePage.dart';
import 'package:dolqun_movies/UI/Pages/FavoritePage.dart';
import 'package:dolqun_movies/UI/Pages/FilterPage.dart';
import 'package:dolqun_movies/UI/Pages/HomePage/HomePage.dart';
import 'package:dolqun_movies/UI/Pages/Models/CacheManagerModel.dart';
import 'package:dolqun_movies/UI/Pages/Models/ColorThemeModel.dart';
import 'package:dolqun_movies/UI/Pages/Models/MainModel.dart';
import 'package:dolqun_movies/UI/Pages/Models/WechatApiModel.dart';
import 'package:dolqun_movies/UI/Pages/ProfilePage.dart';
import 'package:dolqun_movies/UI/Widgets/DolqunAppBar.dart';
import 'package:dolqun_movies/UI/Widgets/MyAnimatedRoute.dart';
import 'package:dolqun_movies/UI/Widgets/PieMenu.dart';
import 'package:dolqun_movies/UI/Widgets/PieTabBar.dart';
import 'package:dolqun_movies/UI/Widgets/PositionHero.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:flutter_statusbarcolor/flutter_statusbarcolor.dart';
import 'package:preload_page_view/preload_page_view.dart';
import 'package:wechat_kit/wechat_kit.dart';

import 'CartPage.dart';
import 'Models/AnimationKeysModel.dart';
import 'Models/MainPageAnimationModel.dart';

class MainPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _MainPageState();

}

class _MainPageState extends State<MainPage> with WidgetsBindingObserver {
  final widthOfNavigation = 250.0;
  final heightOfNavigation = 50.0;
  final controller = PreloadPageController(initialPage: 1, keepPage: true, viewportFraction: 0.99);
  MainPageAnimationModel animationModel;
  ColorThemeModel colorThemeModel;
  var _points = [0.0, 1.0, 0.0];


  void handlePageUpdate(){
    if (this.controller.positions.isNotEmpty) {
      animationModel.page = controller.page ?? 0.0;
      animationModel.applyChanges();
    }

    var temp = 0.0;
    temp = animationModel.page;
    temp = doubleLerp(_points, temp);
    var color = Color.lerp(Theme.of(context).scaffoldBackgroundColor, Color(0xff080613), temp);
    colorThemeModel.backgroundColor = color;
    color = Color.lerp(Theme.of(context).textTheme.body1.color, Colors.blue, temp);
    colorThemeModel.textColor = color;
    color = Color.lerp(Color(0xff080613).withOpacity(0.04), Colors.black.withOpacity(0.04), temp);
    colorThemeModel.maskColor = color;
    color = Color.lerp(Colors.blue, Colors.red, temp);
    colorThemeModel.iconColor = color;
    colorThemeModel.applyChanges();
  }

  @override
  void initState() {
    super.initState();
    SchedulerBinding.instance.addPostFrameCallback((duration) async {
      this.controller.addListener(handlePageUpdate);
      handlePageUpdate();
      try {
        FlutterStatusbarcolor.setStatusBarColor(Colors.transparent);
//        FlutterStatusbarManager.setFullscreen(true);
      }
      catch (exception) {

      }
      ModelContainer.of<CacheManagerModel>(context).model.cacheManager.initialize();

      var wechatApi = ModelContainer.of<WechatApiModel>(context).model;
      var mainModel = ModelContainer.of<MainModel>(context).model;
      var streamBuilder = StreamController<UserInformationResult>();
      wechatApi.onUserSignIn = streamBuilder.stream.asBroadcastStream();
      wechatApi.wechatApi.authResp().listen((event) async {
        BotToast.showLoading();
        var token = await mainModel.api.signInWithWechat(event.code);
        wechatApi.setToken(token.data.token);
        wechatApi.token = await wechatApi.getToken();
        wechatApi.userInfo = await mainModel.api.getUSerInformation(await wechatApi.getToken());
        wechatApi.applyChanges();
        BotToast.closeAllLoading();
        streamBuilder
          ..add(wechatApi.userInfo)
        ..close();
//        print("**************");
//        print(token.data.token);
      });
      await wechatApi.wechatApi.registerApp(appId: Configs.APP_ID);
      var hasWechatInstalled = await wechatApi.wechatApi.isInstalled();
      if (!hasWechatInstalled) {
        showDialog(context: context, builder: (context) => CupertinoAlertDialog(
          title: Text("بۇ يەردە بىر مەسىلە بار"),
          content: Text("رىۋايەتلەردە دىيىلىشىچە سىزنىڭ بۇ تېلېفونىڭىزغا ئۈندىدار قاچىلانماپتۇلەر، شۇ ۋەجىدىن كىرىش، ھەق تۆلەش، ساقلىۋېلىش ۋە باشقا ئىقتىدارلارنى ئىشلەتكىلى بولمايمىشلەر"),
          actions: <Widget>[
            CupertinoButton(child: Text("چۈشىنەرلىك"), onPressed: (){
              Navigator.of(context).pop();
            })
          ],
        ));
        return;
      }
    });
  }

  @override
  void dispose() {
    this.controller.removeListener(handlePageUpdate);
    super.dispose();
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    // TODO: implement didChangeAppLifecycleState
    print("App state changed to '$state'");
    super.didChangeAppLifecycleState(state);
  }

  @override
  Widget build(BuildContext context) {
    var keyModel = ModelContainer.of<AnimationKeysModel>(context).model;
    animationModel = ModelContainer.of<MainPageAnimationModel>(context).model;
    colorThemeModel = ModelContainer.of<ColorThemeModel>(context).model;

    Widget content = Column(
      children: <Widget>[
        Expanded(
          child: PreloadPageView(
            controller: controller,
            children: <Widget>[
              // ProfilePage(),
              BlurredProfilePage(),
              _buildMiddlePage(),
              FilterPage(),
            ],
          ),
        )
      ],
    );

    content = Stack(
      children: <Widget>[
        content,
        Positioned(
          bottom: 0.0,
          left: 0.0,
          right: 0.0,
          child: AnimatedBuilder(
            animation: animationModel.notifier,
            child: buildNavigation(),
            builder: (context, child) {
              var y = animationModel.page;
              if (y > 1) y = 1;
              y = 1 - y;
              y *= 80;
              return Transform.translate(
                offset: Offset(0.0, y),
                child: child,
              );
            },
          ),
        ),
        buildAnimationButton(keyModel.settingsIconKeys, IconButton(
          padding: EdgeInsets.all(0.0),
          alignment: Alignment.center,
          icon: _buildColoredIcon(Icons.settings),
          onPressed: (){
            print("Settings button clicked!");
          },
        )),
        buildAnimationButton(keyModel.cartIconKeys, IconButton(
          padding: EdgeInsets.all(0.0),
          alignment: Alignment.center,
          icon: _buildColoredIcon(Icons.shopping_cart),
          onPressed: (){
            Navigator.of(context).push(MyAnimatedRoute(builder: (context) => CartPage()));
          },
        )),
        buildAnimationButton(keyModel.shareIconKeys, IconButton(
          padding: EdgeInsets.all(0.0),
          alignment: Alignment.center,
          icon: _buildColoredIcon(Icons.mobile_screen_share),
          onPressed: (){
            print("mobile_screen_share button clicked!");
          },
        )),
        buildAnimationButton(keyModel.favoriteIconKeys, IconButton(
          padding: EdgeInsets.all(0.0),
          alignment: Alignment.center,
          icon: _buildColoredIcon(Icons.star),
          onPressed: (){
            Navigator.of(context).push(MyAnimatedRoute(builder: (context) => FavoritePage()));
          },
        )),
        buildAnimationButton(keyModel.accountIconKeys, IconButton(
          padding: EdgeInsets.all(0.0),
          alignment: Alignment.center,
          icon: _buildColoredIcon(Icons.person),
          onPressed: (){
            controller.animateToPage(0, duration: Duration(milliseconds: 1000), curve: Curves.elasticOut);
          },
        )),
        buildAnimationButton(keyModel.searchIconKeys, IconButton(
          padding: EdgeInsets.all(0.0),
          alignment: Alignment.center,
          icon: _buildColoredIcon(Icons.search),
          onPressed: (){
            controller.animateToPage(1, duration: Duration(milliseconds: 1000), curve: Curves.elasticOut);
          },
        )),
        Positioned(
          top: 0.0,
          left: 0.0,
          right: 0.0,
          height: 70.0,
          child: AnimatedBuilder(
            animation: animationModel.notifier,
            builder: (context, child) => Transform.translate(
              offset: Offset(0.0, -(70.0 * 2.0 - 70.0 * animationModel.page)),
              child: child,
            ),
            child: DolqunAppBar(),
          ),
        )
      ],
    );

    content = AnimatedBuilder(
      animation: colorThemeModel.notifier,
      child: content,
      builder: (context, child){
        return Scaffold(
          body: child,
          backgroundColor: colorThemeModel.backgroundColor,
        );
      }
    );
    content = Directionality(
      child: content,
      textDirection: TextDirection.rtl,
    );
    return content;
  }

  Widget buildAnimationButton(List<RenderObjectKeyPair> keys, Widget icon){
    return Positioned(
      left: 0.0,
      child: PositionHero(
        child: icon,
        animation: animationModel.notifier,
        keyOfTargetWidgets: keys,
        offsetTransformer: (key, offset) => Offset(-offset.dx, -offset.dy),
        animationValue: () => animationModel.page
      ),
    );
  }

  Widget _buildColoredIcon(IconData icon){
    return ModelDescendant<ColorThemeModel>(
      onChanged: (context, _, model) => Icon(icon, color: model.iconColor,),
    );
  }

//  Widget buildNavigation(){
//    return Center(
//      child: ClipPath(
//        clipper: NavigationClipper(),
//        child: BackdropFilter(
//          filter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
//          child: Container(
//            alignment: Alignment.bottomCenter,
//            height: heightOfNavigation,
//            width: widthOfNavigation,
//            color: Colors.white.withOpacity(0.04),
//            child: TabBar(
//              unselectedLabelColor: Colors.white30,
//              labelColor: Colors.blue,
//              controller: controller,
//              labelPadding: EdgeInsets.only(bottom: 10.0),
//              tabs: <Widget>[
//                Icon(Icons.person),
//                Icon(Icons.apps),
//                Icon(Icons.all_inclusive),
//              ],
//            ),
//          ),
//        ),
//      ),
//    );
//  }

  Widget buildNavigation(){
    Widget buildingWidget = PieTabBar(
      rotationRatio: 0.4,
      centerTabIndex: 1,
      selectedColor: Theme.of(this.context).primaryColor,
      unselectedColor: Colors.white54,
      background: Container(
        color: Colors.blue.withOpacity(0.1),
      ),
      radius: 100.0,
      controller: controller,
      children: <Widget>[
        ModelDescendant<ColorThemeModel>(
          onChanged: (context, _, model) => Icon(Icons.looks, color: model.iconColor,),
        ),
        ModelDescendant<ColorThemeModel>(
          onChanged: (context, _, model) => Icon(Icons.apps, color: model.iconColor,),
        ),
        ModelDescendant<ColorThemeModel>(
          onChanged: (context, _, model) => Icon(Icons.person, color: model.iconColor,),
        ),
      ],
    );
    return buildingWidget;
  }

  Widget _buildMiddlePage() {
    Widget buildingWidget = AnimatedBuilder(
      child: Stack(
        children: [
          Positioned.fill(
            child: Transform.translate(
              offset: Offset(33.0, 0.0),
              child: Image.asset("assets/images/page_layer.png", fit: BoxFit.fitHeight),
            ),
          ),
          Positioned.fill(
            child: ClipRRect(
              child: Container(
                color: colorThemeModel.backgroundColor,
                child: HomePage(),
              ),
              borderRadius: BorderRadius.circular(40.0),
            ),
          )
        ],
      ),
      animation: animationModel.notifier,
      builder: (context, child) {
        if (animationModel.page > 1) return child;
        return Transform.rotate(
          child: Transform.scale(
            child: child,
            scale: doubleLerp([0.85, 1.0], animationModel.page),
          ),
          angle: (1 - animationModel.page) * 0.25,
          origin: Offset(80.0, 620.0),
        );
        return child;
      },
    );
    return buildingWidget;
  }
}

//class NavigationClipper extends CustomClipper<Path> {
//  var initialize = false;
//
//  @override
//  Path getClip(Size size) {
//    var sizeOfRect = size.height;
//    var path = Path();
//    path.lineTo(size.width - sizeOfRect / 2, 0);
//    var rect = Rect.fromLTWH(size.width - sizeOfRect, 0.0, sizeOfRect, sizeOfRect);
//    path.arcTo(rect, -(3.14 / 2), 3.14 / 2, false);
//    path.lineTo(size.width, size.height);
//    path.lineTo(0.0, size.height);
//    rect = Rect.fromLTWH(0.0, 0.0, sizeOfRect, sizeOfRect);
//    path.lineTo(0.0, sizeOfRect / 2);
//    path.arcTo(rect, 3.14, 3.14 / 2, false);
//    return path;
//  }
//
//  @override
//  bool shouldReclip(CustomClipper<Path> oldClipper) {
//    if (!initialize) {
//      initialize = true;
//      return initialize;
//    }
//    return !initialize;
//  }
//}